<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="../../org/angular.min.js"></script>
</head>

<body ng-app="app" ng-controller="ctrl">
    <ul>
        <!-- $first 第一个 $last最后一个  $middle中间的
    $even 偶数 $odd 奇数
    -->
        <li ng-repeat="(k,v) in data">
            <a style="{{$odd?'color:red':''}}">
                <!-- <a style="{{k==0?'color:red':''}}"> -->
                {{k}} - {{v.name}}</a>
        </li>
        <hr>
        <li ng-repeat="(k,v) in data">
            <a ng-if="$first" style="{{$first?'color:red':''}}">
                {{k}} - {{v.name}}</a>
            <a ng-if="$middle" style="{{$first?'color:red':''}}">
                    {{k}} - {{v.name}}</a>
            <a ng-if="$last" style="{{$last?'color:green':''}}">
                        {{k}} - {{v.name}}</a>
        </li>
    </ul>
    <script>
        var m = angular.module('app', []);
        m.controller('ctrl', ['$scope', function($scope) {
            $scope.data = [{
                    name: '百度',
                    url: 'http://baidu.com'
                },
                {
                    name: '腾讯视频',
                    url: 'http://qq.com'
                },
                {
                    name: '网易新闻',
                    url: 'http://163.com'
                }
            ];
            console.log($scope.data);
        }])
    </script>

</html>
